.topic-list {
  margin: 0 0 10px 0 !important;

  li {
    padding: 3px 0;
    position: relative;
    overflow: hidden;

    &:not(:last-child) {
      border-bottom: 1px solid #f2f2f2;
    }


    .topic-item {
      display: flex;

      .left {
        min-width: 45px;
        min-height: 45px;
      }


      .center {
        margin-left: 5px;
        margin-right: 50px;

        .topic-title {
          color: #555;
          font-size: 16px;
          line-height: 21px;
          font-weight: normal;
          overflow: hidden;
          word-break: break-all;
          -webkit-line-clamp: 2;
          text-overflow: ellipsis;
          -webkit-box-orient: vertical;
          display: -webkit-box;
        }

        .topic-meta {
          position: relative;
          font-size: 12px;
          color: #bbb;
          margin-top: 3px;

          span {
            font-size: 12px;

            &:not(:last-child) {
              margin-right: 3px;
            }

            &.tag {
              height: auto !important;
            }

            &.btn a {
              color: #3273dc;
            }
          }

          a {
            color: #778087;
          }
        }

      }

      .right {
        position: absolute;
        right: 0;

        span.view-count {
          font-size: 12px;
          color: #fff;

          background: #aab0c6;
          padding: 2px 10px;
          border-radius: 6px;
          font-weight: 700;
        }
      }

    }

  }

}

.topic-detail {
  margin-bottom: 20px;

  .header {
    display: flex;
    border-bottom: 1px dashed #f4f4f5;
    padding-bottom: 5px;

    .left {
      //min-width: 80px;
      //min-height: 80px;
      //right: 0;
      //position: absolute;
      margin-right: 10px;
    }

    .right {
      .topic-title {
        color: #555;
        font-size: 16px;
      }

      .topic-meta {
        span {
          font-size: 12px;
          color: #778087;

          a {
            font-size: 12px;
            color: #778087;
          }

          &:not(:last-child) {
            margin-right: 3px;
          }

          &.tag {
            height: auto !important;
          }
        }
      }
    }

  }

  .content {
    padding-top: 10px;
    font-size: 15px;
    color: #000;
  }
}
